<template>
	<view class="sa_content">
		<!-- 返回，默认返回首页 -->
		<view class="sa_return">
			<image :src="HTTP_IMG_UTL+'fanhui.png'" style="width: 28rpx;height: 40rpx;" mode=""
				@click="handelReturn" />
			<view></view>
		</view>
		<!-- 认证您的身份 -->
		<view class="sa_imgs">
			<image :src="HTTP_IMG_UTL+'authentication_282@2x.png'" mode=""
				style="width:376rpx;height: 55rpx;" v-if="lang==='zh'" />
			<view v-if="lang==='ru'" style="font-size: 36rpx;font-weight: bold;">Подтверждение информации вашей компании
			</view>
			<view style="color: #404040;margin-top: 18rpx;" v-if="lang==='zh'">将获得智能助手，精准推送及专属图标</view>
			<view style="color: #404040;margin-top: 18rpx;" v-if="lang==='ru'">Получить виртуального помощника,
				push-уведомления и эксклюзивный значок</view>
		</view>
		<!-- 承接业务文字 -->
		<view class="sa_nationality_title">
			<view>{{$t('承接业务')}}</view>
		</view>
		<view class="sa_sales">
			<u-input :clearable="clearable" maxlength="200" count :placeholder="$t('请输入承接业务')" v-model="value"
				:type="type" :border="border" :height="heights" :auto-height="autoHeight" />
		</view>
		<!-- 营业执照文字 -->
		<view class="sa_License_title">
			<view v-if="lang==='zh'">{{$t('营业执照')}} ({{$t('选填')}})</view>
			<view v-if="lang==='ru'">{{$t('认证视频')}} ({{$t('选填')}})</view>
		</view>
		<view class="sa_detail" v-if="lang==='ru'">
			Запишите видеоподтверждение, в котором вы произносите следующее: “Я - российский продавец. Хочу найти заказы
			на оказание услуг на платформе GLUZ и предлагаю свои профессиональные услуги, в связи с этим подаю заявку на
			подтверждение.”
		</view>
		<view class="sa_images">
			<!-- 上传图片 -->
			<u-upload v-if="lang==='zh'" style="margin-top: 30rpx;padding: 0rpx;margin-left: -10rpx;" :action="action"
				:file-list="list" :max-size="imageMaxSize" :max-count="max_count" :width="width" :height="height"
				:auto-upload="autoUpload" :show-upload-list="showUploadList" :del-bg-color="delBgColor"
				:del-color="delColor" :upload-text="uploadText" :limit-type="limitType" @on-success="onSuccess"
				@on-remove="onRemove" :show-progress="showProgress" />

		</view>
		<view v-if="lang==='ru'" style="margin-top: 68rpx;">
			<formVideos :item="formItem" :postvideo="videoData" :postid="postId" @change="selVideos" />
		</view>
		<view class="sa_but">
			<view class="but_left">
				<u-button @click="handelPreviouspage">{{$t('上一步')}}</u-button>
			</view>
			<view class="but_right">
				<u-button class="custom-style" @click="submit" :disabled="isDisabled" :loading="isLoading">{{$t('认证')}}</u-button>
			</view>
		</view>
		<view class="backColor"></view>
	</view>
</template>

<script>
	import {
		IMAGE_URL,
		HTTP_IMG_UTL
	} from "@/config/app";
	import formVideos from "./components/formVideos.vue";
	import {
		HTTP_REQUEST_URL,
		IMAGE_MAX_SIZE,
		IMAGE_MAX_COUNT
	} from '@/config/app';
	export default {
		components: {
			formVideos
		},
		data() {
			return {
				HTTP_IMG_UTL,
				isDisabled:false,
				isLoading:false,
				formItem: {
					required: false,
					label: '',
					key: 'video',
					value: []
				},
				videoData: '', // 假设这是视频URL或相关数据
				postId: 0, // 假设这是商品或帖子的ID
				// ------------------------------------------------
				showProgress: false, //图片上传配置
				width: '600', //图片上传配置
				height: '212', //图片上传配置
				autoUpload: true, //图片上传配置
				showUploadList: true, //图片上传配置
				delBgColor: '#fa3534', //图片上传配置
				delColor: '#ffffff', //图片上传配置
				max_count: 1, //图片上传的最大数量
				action: HTTP_REQUEST_URL + '/common/upload', //服务器上传地址
				imageMaxSize: IMAGE_MAX_SIZE, //图片上传配置
				imageMaxCount: IMAGE_MAX_COUNT, //图片上传配置
				uploadText: this.$t('请上传营业执照副本照片'), //图片上传配置
				limitType: ['png', 'jpg', 'jpeg', 'webp', 'gif', 'image'], //图片上传配置
				clearable: false,
				value: '', //承接业务
				type: 'textarea',
				border: true,
				heights: 218,
				autoHeight: true,
				lang: 'zh',
				nowLang: 'zh', //获取协议接口使用的当前语言
				list: [], //默认显示的图片列表，数组元素为对象，必须提供url属性
				formDatas: [], //图片列表
				data: {},
				userid: "", //userid
				videoUrl: '', //视频地址
			}
		},
		onLoad(option) {
			this.data = JSON.parse(option.data)

		},
		onShow() {
			this.nowLang = this.$i18n.locale
			// 获取当权语言
			this.getLang()
		},
		methods: {
			// 获取到视频
			selVideos(key, value) {
				this.videoUrl = value[0].url
			},
			// 认证

			submit() {
				if (this.value === '') {
					uni.showToast({
						title: this.$t('请输入承接业务'),
						icon: 'none',
						duration: 1000
					})
				} else if (this.lang === 'zh') { //如果为中国则检查图片是否为空，为空则提示
					this.getApi()
				} else if (this.lang === 'ru') { //如果为俄罗斯则检查视频是否为空，为空则提示
					this.getApi()
					return;
					if (this.videoUrl === '') {
						uni.showToast({
							title: this.lang==='zh'?this.$t('请上传营业执照副本照片'):this.$t('请上传视频'),
							icon: 'none',
							duration: 1000
						})
					} else {
						this.getApi()
					}
				}

			},
			// 调用认证接口
			getApi() {
				this.data.product = this.value //承接业务
				if (this.formDatas.length === 0) {
					this.data.license_image = this.formDatas.toString()
				}
				this.data.agent_code = "" //暂时无所谓
				this.data.user_id = this.userid //用户id
				this.data.video = this.videoUrl ? this.videoUrl : '' //视频
				this.isDisabled = true
				this.isLoading = true
				this.$u.api.release.newProfile(this.data).then(res => {
					this.isDisabled = false
					this.isLoading = false
					// 给用户一个提示
					uni.showToast({
						title: this.$t('认证成功'),
						icon: 'none',
						duration: 1000
					})
					// 一秒后跳转到认证页面
					setTimeout(() => {
						uni.switchTab({
							url: '/pages/tabbar/index'
						})
					}, 1000)
				}).catch(err => {
					this.isDisabled = false
					this.isLoading = false
					uni.showToast({
						title: this.$t('认证失败'),
						icon: 'none',
						duration: 1000
					})
				})
			},
			// 返回上一页
			handelPreviouspage() {
				uni.navigateBack()
			},
			// 获取当权语言
			getLang() {
				// 获取缓存lang当前语言值
				uni.getStorage({
					key: 'lang',
					success: res => {
						if (res.data == 'zh') { //zh为中国，赋值0
							this.lang = 'zh'
						} else { //其他为俄罗斯，赋值1
							this.lang = 'ru'
						}
					}
				});
				uni.getStorage({
					key: 'user_id',
					success: res => {
						this.userid = res.data
					}
				});
			},
			// 返回上一页
			handelReturn() {
				uni.navigateBack()
			},
			// 上传成功
			onSuccess(data, index, lists, name) {
				// 将照片插入数组
				this.formDatas.push(lists[0].response.data.url)
			},
			// 删除图片
			onRemove(index, lists, name) {
				//删除照片
				this.formDatas.splice(index, 1)
			},

		}
	}
</script>

<style lang="scss" scoped>
	.backColor {
		width: 100%;
		height: 1202rpx;
		background: linear-gradient(180deg, #E1F8C7 -3%, rgba(255, 255, 255, 0.2) 56%);
		position: absolute;
		top: 0;
		z-index: -1;
	}

	.sa_detail {
		width: calc(100% - 60rpx);
		margin-top: 32rpx;
		font-size: 24rpx;
		color: #A4A4A4;
	}

	.custom-style {
		background-color: #000000;
		color: #ffffff;
	}

	.but_left {
		width: 20%;
	}

	.but_right {
		width: 75%;
	}

	.sa_but {
		margin: 96rpx 0 96rpx 0;
		width: calc(100% - 60rpx);
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.sa_images {
		width: calc(100% - 60rpx);
		display: flex;
		justify-content: flex-start;
	}

	.sa_License_title {
		width: calc(100% - 60rpx);
		font-size: 28rpx;
		display: flex;
		justify-content: flex-start;
		font-weight: 600;
		margin-top: 30rpx;
	}

	.sa_sales {
		width: calc(100% - 60rpx);
		margin-top: 24rpx;
	}

	.sa_nationality_title {
		width: calc(100% - 60rpx);
		font-size: 28rpx;
		display: flex;
		justify-content: flex-start;
		font-weight: 600;
		margin-top: 60rpx;
	}

	.sa_imgs {
		margin-top: 18rpx;
		width: calc(100% - 60rpx);
		display: flex;
		flex-direction: column;
	}

	.sa_return {
		margin-top: 110rpx;
		width: calc(100% - 60rpx);
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.sa_content {
		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
	}
</style>